.swiper {
  width: 100%;
  height: 12.5rem;

  .bg1 {
      background: url(../../assets/image/index-swiper-bg1.jpg) no-repeat center/cover;
  }

  .bg2 {
      background: url(../../assets/image/index-swiper-bg2.jpg) no-repeat center/cover;
  }

  .bg3 {
      background: url(../../assets/image/index-swiper-bg3.jpg) no-repeat center/cover;
  }
}

// 排名+打卡
.rank-punch {
  display: flex;
  justify-content: space-between;
  margin-top: 1.25rem;

  // 排名
  .rank {
      flex: 2;
      height: 9.375rem;
      background: #1592CC url(../../assets/image/index-card-rank.png) no-repeat -0.9375rem 1.875rem;
      background-size: 80%;
      margin-right: 1.25rem;
      border-radius: .9375rem;
      position: relative;

      h3 {
          font-size: 1.25rem;
          color: #004E73;
          position: absolute;
          top: .9375rem;
          left: .625rem;
      }

      p {
          font-size: 3.125rem;
          color: #fff;
          position: absolute;
          top: 2.375rem;
          right: .9375rem;
      }
  }

  // 打卡
  .punch {
      flex: 3;
      border-radius: .9375rem;
      background: #7BCBF5 url(../../assets/image/index-card-sum.png) no-repeat .625rem .625rem;
      background-size: 60%;
      position: relative;

      h3 {
          font-size: 1.25rem;
          color: #004E73;
          position: absolute;
          top: .9375rem;
          left: .625rem;
      }

      button {
          font-size: 1rem;
          border-radius: 1.25rem;
          color: #004E73;
          padding: .5rem .75rem;
          background: rgba(0, 0, 0, 0);
          border: .1875rem solid #005177;
          position: absolute;
          top: 5.3125rem;
          right: .9375rem;
      }
  }
}

// 运动数据+徽章
.data-badge {
  display: flex;
  justify-content: space-between;
  margin-top: 1.25rem;

  // 运动数据
  .data {
      flex: 1;
      height: 6.875rem;
      background: red url(../../assets/image/index-card-data.png) no-repeat center/cover;
      margin-right: 1.25rem;
      border-radius: .9375rem;
      position: relative;

      h3 {
          color: #fff;
          font-size: 1rem;
          position: absolute;
          top: .75rem;
          left: .875rem;
      }
  }

  // 徽章
  .badge {
      flex: 1;
      background: #9dbde3 url(../../assets/image/index-card-badge.png) no-repeat 0rem 1.25rem;
      background-size: 55%;
      border-radius: .9375rem;
      position: relative;

      h3 {
          color: #005177;
          font-size: 1rem;
          position: absolute;
          top: .75rem;
          left: .875rem;
      }

      div {
          position: absolute;
          top: .625rem;
          right: .875rem;

          b {
              font-size: 5rem;
              color: #004E73;
          }

          span {
              font-size: 1.125rem;
          }
      }
  }
}

// 训练
.train{
  width: 100%;
  height: 6.875rem;
  background: url(../../assets/image/训练.png) no-repeat center/cover;
  border-radius: .9375rem;
  margin-top: 1.25rem;
  position: relative;
  h3{
      color: #fff;
      font-size: 1rem;
      position: absolute;
      top: .8125rem;
      left: .9375rem;
  }
}

//户外跑步
.run{
  width: 100%;
  height: 6.875rem;
  background: url(../../assets/image/course-img02.png) no-repeat center/cover;
  border-radius: .9375rem;
  margin-top: 1.25rem;
  position: relative;
  h3{
      color: #fff;
      font-size: 1rem;
      position: absolute;
      top: .8125rem;
      left: .9375rem;
  }
}


